<template>
  <div style="width:100%;height:100%">
    <div style="height: 50px;">
      <el-row type="flex" :gutter="100" align="bottom">
        <el-col :span="6">
          <el-date-picker
            v-model="startTime"
            type="datetime"
            placeholder="开始时间">
          </el-date-picker>
        </el-col>
        <el-col :span="6">
          <el-select clearable style="width: 150px" v-model="student" placeholder="选择学生">
            <el-option
              v-for="item in students"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-col>
        <el-col :span="6">
          <el-button  @click="search" type="primary">搜索结果</el-button>
          <!--          <el-button type="success" @click="publish">发布考勤</el-button>-->
        </el-col>
        <!--        <el-col :span="6">-->
        <!--          <el-date-picker-->
        <!--            v-model="endTime"-->
        <!--            type="datetime"-->
        <!--            placeholder="结束时间">-->
        <!--          </el-date-picker>-->
        <!--        </el-col>-->
      </el-row>
    </div>
    <!--    <div style="height: 50px">-->
    <!--      <el-row type="flex" :gutter="100" align="bottom" style="margin-top: 10px">-->
    <!--        <el-col :span="6">-->
    <!--        </el-col>-->
    <!--        <el-col :span="6">-->


    <!--        </el-col>-->
    <!--        <el-col :span="6">-->
    <!--        </el-col>-->
    <!--        <el-col :span="6">-->
    <!--          <el-button  @click="search" type="primary">搜索结果</el-button>-->
    <!--&lt;!&ndash;          <el-button type="success" @click="publish">发布考勤</el-button>&ndash;&gt;-->
    <!--        </el-col>-->

    <!--      </el-row>-->
    <!--    </div>-->
    <div style="height: -webkit-calc(100% - 100px);margin-top: 5px">
      <xjr-table @custom-click="handleCourse" :loading="loading" ref="course_table" :list="tableData" :headers="cols"></xjr-table>
    </div>
  </div>
</template>

<script>
  export default {
    name: "draggableListManager",
    data(){
      return {
        students:[],
        studentsCache:[],
        student:'',
        endTime:new Date(),
        startTime:'',
        loading:false,
        tableData:[],
        cols:[{prop:'studentNo',label:'学生编号',sort:false,hidden:true},
          {prop:'studentName',label:'学生姓名',sort:false,hidden:false},
          {prop:'leaveStartTime',label:'请假开始时间',sort:false,hidden:false,dataType:'date'},
          {prop:'leaveEndTime',label:'请假结束时间',sort:false,hidden:false,dataType:'date'},
          {prop:'leaveReason',label:'请假理由',sort:false,hidden:false},
          {prop:'leaveResult',label:'请假结果',sort:false,hidden:false},
          {prop:'operate',label:'操作',hidden:false,options:[
              {label:'同意',prop:'agree'},
              {label:'驳回',prop:'disagree',type:'danger'}
            ]}
        ],
        filterOption:'',
        options:[{
          label:'全部',value:'all'
        },{
          label:'我发布的',value:'my'
        }],
        attendanceItems:[
          {label:'全部',value:'all'}
        ]
      }
    },
    methods:{

      async handleCourse(index,row,customType){
        let g=this;

        if (customType==='agree'){
          g.$ajaxPost('/leave/agree',{guid:row.guid,leaveStartTime:row.leaveStartTime,leaveEndTime:row.leaveEndTime,studentNo:row.studentNo}).then(res=>{
            this.loadList();
          })
        }
        if(customType==='disagree'){
          g.$ajaxPost('/leave/disagree',{guid:row.guid,leaveStartTime:row.leaveStartTime,leaveEndTime:row.leaveEndTime,studentNo:row.studentNo}).then(res=>{
            this.loadList();
          })
        }

      },
      async loadAllleaves(){
        let leavesBo = {
          operator: this.$store.getters.userId,
          permission:this.$store.getters.permissions
        }
        return this.$ajaxPost('/leave/getByCondition',leavesBo)

      },

      async loadList(){
        let g=this;
        let initFlag=await this.init();
        let leaveData=await g.loadAllleaves()
        g.tableData=leaveData.map(d=>{
          //编辑删除权限
          if (!g.isNullOrEmpty(d.validFlag)) {
            //同意
            if(d.validFlag==1 || d.validFlag==2){
              g.$set(d, 'disableOptions', ['agree','disagree']);
            }
          }
          return d;
        });
      },
      loadStudents(){
        let g=this;
        return g.$ajaxGet('/student/all/');
      },
      async init() {
        let g = this;
        g.studentsCache = await g.loadStudents();
        g.students = g.studentsCache.map(data => {
          g.$set(data, 'label', data.name);
          g.$set(data, 'value', data.guid);
          return data;
        })
      },
        search(){
        let g=this;
        g.tableData=[];
        g.loadList().then(res=>{
          g.$nextTick(()=>{
            g.tableData=g.tableData.filter(data=>{
              if (!g.isNullOrEmpty(g.student)){
                return  data.studentNo===g.student;
              }
              return true;
            }).filter(data=>{
              if (!g.isNullOrEmpty(g.startTime)){
                return data.leaveStartTime - g.startTime.getTime() >= 0;
              }
              return true;
            })

          })
        });





      },



    },
    created() {
      this.loadList();

    },
  }
</script>

<style scoped>

</style>
